<!DOCTYPE html>
<html>
<link rel="stylesheet" href="/static/codemirror/lib/codemirror.css">
<script src="/static/codemirror/lib/codemirror.js"></script>
<script src="/static/codemirror/Language/python.js"></script>
<script src="/static/js/jquery.min.js"></script>
<!--引入css文件，用以支持主题-->
<link rel="stylesheet" href="/static/codemirror/theme/dracula.css">

<head>
    <title>CodeMirror</title>
</head>

<body>
    <div id='box' style="display: none">
        <textarea id="code"></textarea>
    </div>
    <div style="display: none">
        <button class="button" id="codeEidtFormPostSubmit" onclick="submit()">提交</button>
        <form id='codeEidtFormPost' s>
            <input type="text" name="editValues" id="editValues">
            <input type="text" name="fileName" id="fileName">
            <input type="text" name="encoding" id="encoding">
        </form>
    </div>
</body>
<script type="text/javascript">
    var Base64 = {

        // private property
        _keyStr: "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",

        // public method for encoding
        encode: function (input) {
                var output = "";
                var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
                var i = 0;

                input = Base64._utf8_encode(input);

                while (i < input.length) {

                    chr1 = input.charCodeAt(i++);
                    chr2 = input.charCodeAt(i++);
                    chr3 = input.charCodeAt(i++);

                    enc1 = chr1 >> 2;
                    enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
                    enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
                    enc4 = chr3 & 63;

                    if (isNaN(chr2)) {
                        enc3 = enc4 = 64;
                    } else if (isNaN(chr3)) {
                        enc4 = 64;
                    }

                    output = output + this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) + this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);

                }

                return output;
            },

            // public method for decoding
            decode: function (input) {
                var output = "";
                var chr1, chr2, chr3;
                var enc1, enc2, enc3, enc4;
                var i = 0;

                input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");

                while (i < input.length) {

                    enc1 = this._keyStr.indexOf(input.charAt(i++));
                    enc2 = this._keyStr.indexOf(input.charAt(i++));
                    enc3 = this._keyStr.indexOf(input.charAt(i++));
                    enc4 = this._keyStr.indexOf(input.charAt(i++));

                    chr1 = (enc1 << 2) | (enc2 >> 4);
                    chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
                    chr3 = ((enc3 & 3) << 6) | enc4;

                    output = output + String.fromCharCode(chr1);

                    if (enc3 != 64) {
                        output = output + String.fromCharCode(chr2);
                    }
                    if (enc4 != 64) {
                        output = output + String.fromCharCode(chr3);
                    }

                }

                output = Base64._utf8_decode(output);

                return output;

            },

            // private method for UTF-8 encoding
            _utf8_encode: function (string) {
                string = string.replace(/\r\n/g, "\n");
                var utftext = "";

                for (var n = 0; n < string.length; n++) {

                    var c = string.charCodeAt(n);

                    if (c < 128) {
                        utftext += String.fromCharCode(c);
                    } else if ((c > 127) && (c < 2048)) {
                        utftext += String.fromCharCode((c >> 6) | 192);
                        utftext += String.fromCharCode((c & 63) | 128);
                    } else {
                        utftext += String.fromCharCode((c >> 12) | 224);
                        utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                        utftext += String.fromCharCode((c & 63) | 128);
                    }

                }

                return utftext;
            },

            // private method for UTF-8 decoding
            _utf8_decode: function (utftext) {
                var string = "";
                var i = 0;
                var c = c1 = c2 = 0;

                while (i < utftext.length) {

                    c = utftext.charCodeAt(i);

                    if (c < 128) {
                        string += String.fromCharCode(c);
                        i++;
                    } else if ((c > 191) && (c < 224)) {
                        c2 = utftext.charCodeAt(i + 1);
                        string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                        i += 2;
                    } else {
                        c2 = utftext.charCodeAt(i + 1);
                        c3 = utftext.charCodeAt(i + 2);
                        string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                        i += 3;
                    }

                }

                return string;
            }
    };
    $.ajax({
        type: "POST",
        dataType: "html",
        url: '/codeEdit',
        data: {
            'path': '{{filename}}'
        },
        success: function (data) {
            resultCode = jQuery.parseJSON(data).resultCode;
            fileCode = jQuery.parseJSON(data).fileCode;
            if (resultCode == '1') {
                alert('读取文件出错,请返回重试!错误内容:' + fileCode);
                return false
            };
            document.getElementById("box").style.display = 'block';
            var encoding = jQuery.parseJSON(data).encoding;
            var fileName = jQuery.parseJSON(data).fileName;
            var editor = CodeMirror.fromTextArea(document.getElementById("code"), {
                mode: "text/x-python",

                //显示行号
                lineNumbers: true,
                tabSize: 4,
                indentUnit: 4,
                //设置主题
                theme: "dracula",
                //自动换行
                lineWrapping: false,
                foldGutter: true,
                gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
                //全屏模式
                fullScreen: false,
                //括号匹配
                matchBrackets: true,
                extraKeys: {
                    "Ctrl-S": function () {
                        document.getElementById("codeEidtFormPostSubmit").click()
                    },
                }
            });

            editor.setValue(fileCode);
            var htmlWidth = document.body.clientWidth;

            editor.setSize(htmlWidth, 680);
            submit = function () {
                var editValues = editor.getValue();
                $.ajax({
                    type: "POST",
                    dataType: "html",
                    url: '/saveEditCode',
                    data: {
                        'editValues': Base64.encode(editValues),
                        'fileName': Base64.encode(fileName)
                    },
                    success: function (data) {
                        resultCode = jQuery.parseJSON(data).resultCode;
                        if (resultCode == '0') {
                            window.parent.layer.msg('保存成功');
                        } else {
                            alert(jQuery.parseJSON(data).result);
                        }
                    }
                });


            }
        }

    });
</script>

</html>